<template>
  <!-- <view class="mine_list"> 
   <view class="mine_lists" @click="invoice('大客户', '/pages/customers/customers')" v-if="customersId">
      <view>
        <image src="https://wx.anlan.tech/uploads/20220624/1e7ff9236a0f1c5e6a3fa676c9d07066.png"></image>
        <text>大客户</text>
      </view>
      <uni-icons type="right" color="#999" size="20"></uni-icons>
    </view> 
  <image src="../../static/mine/jf.png" mode=""></image>
     <view class="mine_lists" v-for="item in list" :key="item.name" @click="toNav(item.name, item.path)">
      <view>
        <image :src="item.img"></image>
        <text>{{ item.name }}</text>
      </view>
      <uni-icons type="right" color="#999" size="20"></uni-icons>
    </view>
  </view>-->
  <view class="package center">
    <view class="column" v-for="item in list" :key="item.name" @click="toNav(item.name, item.path)">
      <image :src="item.img"></image>
      <text style="font-size: 28rpx;">{{ item.name }}</text>
    </view>
  </view>
</template>

<script setup lang="ts">
  import { navTo } from '@/utils/navigator';
  import { showToast } from '@/utils/prompt';
  import {
    ability1,
    ability2, ability3, ability4, ability5, ability6, ability7, ability8, ability9, ability10, ability11, ability12, ability13,
    ability14, ability15, ability16

  } from '@/utils/Static';
  // view
  const list = [
    // {
    //   img: ability1,
    //   name: '车辆管理',
    //   path: 'mine/carList',
    // },
    // {
    //   img: ability2,
    //   name: '预约服务记录',
    //   path: 'appointment/list',
    // }, 
    {
      img: ability14,
      name: '我的订单',
      path: 'order/myOrder',
    },
    {
      img: ability15,
      name: '我的存货',
      path: 'order/myStock',
    },
    // pointsMall/integrate
    // pointsMall/integral
    {
      img: ability9,
      name: '积分',
      path: 'pointsMall/integral',
    },
    {
      img: ability4,
      name: '授权账户',
      path: 'authorized/authorizedList',
    },
    {
      img: ability5,
      name: '蓝天卡',
      path: 'giftCard/tokenCard',
    },
    {
      img: ability13,
      name: '我的下线',
      path: 'invitation/subordinate',
    },
    {
      img: ability12,
      name: '我的车队',
      path: 'fleet/fleet/myfleet',
    },
    {
      img: ability6,
      name: '发票管理',
    },
    // {
    //   img: ability7,
    //   name: '邀请好友',
    //   path: 'mine/friends',
    // },
    {
      img: ability8,
      name: '常驻地址',
      path: 'address/address',
    },

    {
      img: ability3,
      name: '购物车',
      path: 'shopp/myCar',
    },
    {
      img: ability10,
      name: '联系我们',
      path: 'mine/contactUs',
    },
    {
      img: ability11,
      name: '投诉建议',
      path: 'mine/suggestions',
    }, {
      img: ability16,
      name: '拼单列表',
      path: 'together/togetherList',
    }
  ];

  function toNav(name : string, path : string) {
    if (name === '发票管理') {
      showToast('发票管理  暂未开通');
    } else {
      navTo(path);
    }
  }
</script>

<style scoped lang="less">
  .mine_list {
    width: 95%;
    margin: 10rpx 2.5%;
    background-color: white;
    border-radius: 5px;
    box-shadow: 1px 2px 4px 0px rgba(204, 204, 204, 0.5);
    padding: 0px 20rpx;
    box-sizing: border-box;

    .mine_lists:nth-last-child(1) {
      border: none;
    }

    .mine_lists {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border-bottom: 1px solid #eee;

      view {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding: 30rpx 10rpx;
        box-sizing: border-box;

        image {
          width: 50rpx;
          height: 50rpx;
          margin-right: 20rpx;
        }

        text {
          font-size: 30rpx;
          font-weight: 400;
          color: #333333;
        }
      }
    }
  }

  .package {
    flex-wrap: wrap;
    padding: 0px;

    view {
      width: 25%;
      padding: 30rpx 0px;
      box-sizing: border-box;

      image {
        width: 50rpx;
        height: 50rpx;
      }
    }
  }
</style>